<!--
 * @Author: 偻儸小卒[EdisonLiu_]
 * @Date: 1970-01-01 08:00:00
 * @LastEditors: 偻儸小卒[EdisonLiu_]
 * @LastEditTime: 2020-04-11 16:38:39
 * @Description: 
 -->
<template>
  <commonPage :showHeader="true" :header_title="header_title">
    <div slot="page_body" style="height:100%">
      <div class="page_body">
        <div class="user_header">
          <img src="@/assets/images/user/user_bg.jpg" alt="" />
          <div class="user_info">
            <div class="cont">
              <div class="avatar">
                <img :src="member.avatar" alt="" />
              </div>
              <div class="username">{{ member.username }}</div>
            </div>
          </div>
        </div>
        <div class="edit_list">
          <group class="edit_list_group">
            <cell
              class="edit_list_cell"
              title="我的赛事"
              is-link
              link="/user/user_match/index"
            >
              <img
                slot="icon"
                width="25"
                style="display:block;margin-right:0.5rem;"
                src="@/assets/images/user/user_match.png"
              />
            </cell>
            <cell
              class="edit_list_cell"
              title="个人资料"
              is-link
              link="/user/useredit/index"
            >
              <img
                slot="icon"
                width="25"
                style="display:block;margin-right:0.5rem;"
                src="@/assets/images/user/user_edit.png"
              />
            </cell>
          </group>
        </div>
      </div>
    </div>
  </commonPage>
</template>
<script>
import commonPage from "../common/commonPage";
import matchInc from "../plugin/match_inc";
export default {
  name: "match_detail",
  data() {
    return {
      header_title: "赛事详情",
      member: {
        avatar: require("@/assets/images/index/logo.png"),
        username: "--"
      }
    };
  },
  components: {
    commonPage,
    matchInc
  },
  created() {
    this.get_user()
    this.$wxShare(
      {
        title: "分享标题", // 分享标题
        desc: "分享描述", // 分享描述
        link: window.location.href // 分享链接
        //   debug:true
      },
      function() {
        //分享成功后的回调函数
      }
    );
  },
  methods: {
     get_user() {
      this.$axios
        .post("user.getInfo", {})
        .then(res => {
          this.member.username=res.result.nickname;
          this.member.avatar=res.result.avatar;
          
        })
        .catch(error => {
          console.log(error);
        });
    }
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="stylus" scoped>
.page_body {
  font-size 0.8rem
  margin-bottom: 1rem;
  width: 100%;
  height: 100%;
  overflow: hidden;

  .user_header {
    position: relative;

    img {
      width: 100%;
      height: auto;
    }

    .user_info {
      height: 100%;
      width: 100%;
      top: 0;
      left: 0;
      position: absolute;
      display: flex;
      align-items: center;
      justify-content: center;

      .cont {
        text-align: center;
        color: #000;
        margin-top: 0.8rem;

        .avatar {
          border-radius: 3.5rem;
          border: 0.1rem solid #fff;
          width: 3.5rem;
          height: 3.5rem;
          display: block;
          margin: 0 auto;

          img {
            height: 3.5rem;
            width: 3.5rem;
            vertical-align: middle;
             border-radius: 3.5rem;
          }
        }

        .username {
          font-size: 1rem;
        }
      }
    }
  }

  .edit_list {
    background: #fff;
    border-radius: 0.5rem;
    min-height: 50%;
    width: 90%;
    margin-left: 5%;

    .edit_list_group {
      margin-bottom: 1rem;

      .edit_list_cell {
        height: 3rem;
      }

      .edit_list_cell:after {
        content: ' ';
        position: absolute;
        bottom: 0;
        right: 0;
        height: 1px;
        border-bottom: 1px solid #e5eaf9;
        color: #e5eaf9;
        width: calc(100% - 30px);
        left: 15px;
      }

      .edit_list_cell:before {
        content: none;
      }
    }
  }
}
</style>

<style lang="stylus" >
.edit_list_group {
  .weui-cells {
    p{
      font-size 0.8rem
      line-height 1rem
      height 1rem
    }
    &:before {
      content: none;
    }

    &:after {
      content: none;
    }
  }
}
</style>